<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>注册 | 欢迎前往另一个世界</title><!-- Favicon -->
    <link rel="stylesheet" th:href="@{/css/backend.css}">
    <style th:inline="css">
        .wrapper{
            background: url([[@{/image/background.png}]]) fixed;
            background-size: cover;
        }
    </style>
</head>

<body>
    <div class="wrapper">
        <section class="login-content">
            <div class="container">
                <div class="row align-items-center justify-content-center height-self-center">
                    <div class="col-lg-8">
                        <div class="card auth-card" style="overflow: inherit;border: 0px;">
                            <div class="card-body p-0">
                                <div class="d-flex  auth-content">
                                    <div class="col-lg-6  content-left"
                                        style="background-color: white;border-radius: 8px 0px 0px 8px;">
                                        <div class="p-3 ">
                                            <div>
                                                <h2 class="mb-2 text-primary" >注册</h2>
                                                <p>欢迎注册本系统。</p>
                                                <!-- <p>これは別の世界への扉です</p> -->
                                                <p th:text="${msg}" style="color: red;"></p>
                                            </div>
                                            <form th:action="@{/auth/signup}" method="post">
                                                <div class="row">
                                                    <div class="col-lg-12">
                                                        <div class="floating-label form-group">
                                                            <input
                                                                class="floating-input form-control" type="text"
                                                                placeholder=" "
                                                                name="username"
                                                                required
                                                                style="border-color:#f3f3f3">
                                                            <label>用户名</label>
                                                        </div>
                                                    </div>
                                                    <div class="col-lg-6">
                                                        <div class="floating-label form-group">
                                                            <input
                                                                class="floating-input form-control" type="password"
                                                                placeholder=" "
                                                                name="password"
                                                                required
                                                                style="border-color:#f3f3f3">
                                                            <label>密码</label>
                                                        </div>
                                                    </div>
                                                    <div class="col-lg-6">
                                                        <div class="floating-label form-group">
                                                            <input
                                                                class="floating-input form-control" type="password"
                                                                placeholder=" "
                                                                required
                                                                name="password2"
                                                                style="border-color:#f3f3f3">
                                                            <label>重复密码</label>
                                                        </div>
                                                    </div>
                                                    <div class="col-lg-6">
                                                        <div class="custom-control custom-checkbox mb-3">
                                                            <input
                                                                type="checkbox" class="custom-control-input"
                                                                id="customCheck1" required>
                                                            <label
                                                                class="custom-control-label control-label-1 "
                                                                for="customCheck1">同意服务条款</label>
                                                        </div>
                                                    </div>
                                                    <div class="col-lg-6"><a th:href="@{/login}" class="float-right">已有账号？登录</a></div>
                                                </div>
                                                <button type="submit" class="btn btn-primary marlene-btn-login btn-block" style="border-radius: 1.25rem;border: 0px;font-size: 1.4rem;">注册</button>
                                            </form>
                                        </div>
                                    </div>
                                    <div class="col-lg-6 content-right"><img th:src="@{/picture/xilufei.png}"
                                        class="img-fluid image-right" alt="" style="margin-top: -3.5rem;"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </div><!-- Backend Bundle JavaScript --><!---->

    <script th:src="@{js/backend-bundle.min.js}"></script><!-- Table Treeview JavaScript -->

</body>

</html>